<template>
  <div>
    <el-dialog
        title="提示"
        :visible.sync="dialogVisible"
        width="30%"
        :before-close="handleClose">
<!--      <span>这是一段信息</span>-->
<!--      表单内容-->
      <el-form :label-position="labelPosition" label-width="80px" :model="user">
        <el-form-item label="用户名">
          <el-input :disabled="updateNow?false:true" v-model="user.username"></el-input>
        </el-form-item>
        <el-form-item label="密码">
          <el-input :disabled="updateNow?false:true" v-model="user.password"></el-input>
        </el-form-item>
        <el-form-item label="名称">
          <el-input :disabled="updateNow?false:true" v-model="user.nickname"></el-input>
        </el-form-item>
        <el-form-item label="邮箱">
          <el-input :disabled="updateNow?false:true" v-model="user.email"></el-input>
        </el-form-item>
        <el-form-item label="电话">
          <el-input :disabled="updateNow?false:true" v-model="user.phone"></el-input>
        </el-form-item>
        <el-form-item label="地址">
          <el-input :disabled="updateNow?false:true" v-model="user.address"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
         <el-button @click="handleCenter">取 消</el-button>
         <el-button type="primary" @click="handleClose('sure')">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  name: "propView",
  props:{
    showForm:{
      type: Boolean,
      default: false
    },
    updateNow:{
      type: String,
      default: ""
    },
    userData:{
      type: Object,
      default: function (){
        return {}
      }
    }
  },
  data(){
    return {
      user:{},
      labelPosition: 'right',
      dialogVisible:false
    }
  },
  watch:{
    showForm(){
      this.dialogVisible=this.showForm
    },
    userData:{
      deep:true,
      immediate:true,
      handler(newValue,oldValue){
        this.user=this.userData
        console.log(newValue,oldValue,"用户信息",this.user)
      }
    },
    updateNow:{
      immediate:true,
      handler(){
        console.log("updateNowupdateNowupdateNow",this.updateNow)
      }
    }
  },
  mounted() {
    this.dialogVisible=this.showForm
    this.user=this.userData
    console.log("用户信息",this.user)
  },
  methods:{
    handleClose(){
      this.$emit("close",this.user)
    },
    handleCenter(){
      this.$emit("close")
    }
  }
}
</script>

<style scoped>

</style>